<script setup lang="ts">
import ConsultItem from './ConsultItem.vue'
import { ConsultType } from '@/enums'
import { getConsultOrderListService } from '@/api/consult'
import { onMounted, ref } from 'vue'
import type { ConsultOrderItem, ConsultOrderListPageParams } from '@/types/consult'
import { Toast } from 'vant'

const props = defineProps<{
  type: ConsultType
}>()
const orderList = ref<ConsultOrderItem[]>([])
const params = ref<ConsultOrderListPageParams>({
  current: '1',
  pageSize: '10',
  type: props.type,
})
const loading = ref(false) // 列表是否正在加载中
const finished = ref(false)
const isFirstLoad = ref(true)
const getOrderList = async () => {
  let t
  if (isFirstLoad.value) {
    t = Toast.loading({
      message: '努力加载中...',
      duration: 0, // 取消自动关闭
    })
  }
  try {
    loading.value = true
    const { total, pageTotal, rows } = await getConsultOrderListService(params.value)
    orderList.value.push(...rows)
    params.value.current = String(Number(params.value.current) + 1)
    if (Number(params.value.current) > pageTotal) {
      // 没有更多了
      finished.value = true
    }
  } catch (error) {
    console.log(error)
  } finally {
    loading.value = false
    if (isFirstLoad.value) {
      t!.clear()
      isFirstLoad.value = false
    }
  }
}

// 刷新列表
const refreshList = () => {
  orderList.value = []
  params.value.current = '1'
  // isFirstLoad.value = true
  getOrderList()
}

onMounted(() => {
  getOrderList()
})
</script>

<template>
  <div class="consult-list">
    <van-empty v-if="orderList.length === 0" description="暂无记录" />
    <template v-else>
      <van-list
        v-model:loading="loading"
        @load="getOrderList"
        :finished="finished"
        finished-text="没有更多了~"
        ><consult-item
          v-for="item in orderList"
          :key="item.id"
          :item="item"
          @refresh-list="refreshList"
      /></van-list>
    </template>
  </div>
</template>

<style lang="scss" scoped>
.consult-list {
  padding: 10px 15px;
}
</style>
